$.ajax({
    url: '/admin/users',
    type: 'GET',
    data: {
        pagenum: '1',
        pagesize: '5'
    },
    success: function(res) {
        console.log(res);
    }
})

$(function() {
    var layer = layui.layer;
    var laypage = layui.laypage;
    var form = layui.form;

    // 配置请求参数对象 
    var q = {
        pagenum: 1, //页码值
        pagesize: 3 //每页显示的数据量
    }

    //获取用户列表数据
    initUserList()

    function initUserList() {
        $.ajax({
            method: 'GET',
            url: '/admin/users',
            data: q,
            success: function(res) {
                // console.log(res);
                if (res.status !== 0) {
                    return layer.msg(res.message)
                }
                //使用模板引擎渲染页面数据
                var htmlStr = template('tpl-table', res)
                $('tbody').html(htmlStr)

                renderPage(res.total)
            }
        })
    }

    //定义渲染分页的方法
    function renderPage(total) {
        // console.log(total);
        laypage.render({
            elem: 'articlePage', //指向存放分页的容器
            count: total, //数据总数
            limit: q.pagesize, //每页显示的条数
            curr: q.pagenum, //起始页
            layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
            limits: [2, 3, 5, 10],
            //分页发生切换的时候，触发jump回调
            // 触发jump回调有两种：
            // 1.点击页码的时候  会触发jump回调
            // 2.只要调用了 laypage.render() 就会触发 jump 回调
            jump: function(obj, first) {
                // 可以通过first的值来判断是通过哪种方式触发的回调
                // 1.如果值为 true 证明是方式2 触发的
                // 2.否则就是触发方式1
                // 把最新的的页码值，赋值到 q 这个查询参数对象中
                q.pagenum = obj.curr; // 起始页
                q.pagesize = obj.limit;
                if (!first) {
                    initUserList()
                }
            }
        })

    }


    //编辑用户
    $('tbody').on('click', '.edit', function() {
        var id = $(this).siblings('.delete').attr('data_id')
            // console.log(id);
        window.localStorage.setItem('user_id', JSON.stringify(id));
    })


    // 删除
    $('tbody').on('click', '.delete', function() {
        var id = $(this).attr('data_id')
            // console.log(id);
        layer.confirm('确认删除吗?', { icon: 3, title: '提示' }, function(index) {
            $.ajax({
                method: 'DELETE',
                url: '/admin/users/' + id,
                success: function(res) {
                    if (res.status !== 0) {
                        return layer.msg(res.message)
                    }
                    layer.msg(res.message)
                        //删除后需要重新渲染页面数据信息
                    initUserList()
                }
            })
            layer.close(index);
        });
    })


    // 重置用户密码
    $('tbody').on('click', '.resetpwd', function() {
        // var code = $(this).siblings('.delete').attr('data_id')
        // console.log(code);

        // 获取id
        var id = $(this).attr('data_id');
        // 配置密码框弹出层
        pwdBox = layer.open({
            type: 1,
            area: ['500px', '250px'],
            title: '重置密码',
            content: $('#repwd-form-tpl').html()
        });

        // 表单验证
        form.verify({
            pwd: [/^[\S]{6,12}$/, '密码不能包含空格，必须6到12位！'],
            repwd: function(value) {
                if (value !== $('[name="password"]').val()) {
                    return '两次密码输入不一致！'
                }
            }
        })

        $('body').on('submit', '#repwd-form', function(e) {
            e.preventDefault()
            var password = $('[name=password]').val();
            $.ajax({
                method: 'PUT',
                url: `/admin/users/${id}`,
                data: { password: password },
                success: function(res) {
                    if (res.status !== 0) {
                        layer.close(pwdBox)
                        return layer.msg(res.message)
                    }
                    layer.msg(res.message)
                        //关闭密码框弹出层
                    layer.close(pwdBox)

                }
            })
        })

    })













})